import React from 'react';
import { connect } from 'react-redux';
import actions from '../../store/actions/todo';
@connect(
    state => state.todo,
    actions
)
class TodoFooter extends React.Component {
    constructor() {
        super();
    }
    changeDisplayClick = event => {
        this.props.changeDisplay(event.target.dataset.display);
    };
    render() {
        return (
            <div>
                <button
                    data-display="all"
                    onClick={e => this.changeDisplayClick(e)}>
                    全部
                </button>
                <button
                    data-display="uncompleted"
                    onClick={this.changeDisplayClick}>
                    未完成
                </button>
                <button
                    data-display="completed"
                    onClick={this.changeDisplayClick}>
                    已完成
                </button>
            </div>
        );
    }
}
export default TodoFooter;
